<template>
  <div class="main_box" style="padding-right:10px">
      <div class="add_wrap">
          <div class="tit">
            <h2>新 增 标 本 箱 2.0</h2>
            <el-button type="success" plain size="small" icon="fa fa-mail-forward" @click="returnList"> 返 回</el-button>
          </div>
          <el-form :model="dataForm" ref="dataForm" label-width="180px" :rules="roleRules">
              <el-row>
                  <el-form-item label="设备名称" prop="boxName">
                    <el-input v-model="dataForm.boxName" @keydown.native="keydown($event)"></el-input>
                  </el-form-item>
                  <el-form-item label="物联网卡" prop="cardId">
                    <!-- <el-input v-model=""></el-input> -->
                    <el-select v-model="dataForm.cardId" clearable placeholder="请选择物联网卡">
                        <el-option
                        v-for="item in pickIpCardList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                        ></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="收样员" prop="syUserId" style="width:100%;">
                    <el-select
                        v-model="dataForm.syUserId"
                        filterable
                        clearable
                        reserve-keyword
                        placeholder="请选择收样员">
                        <el-option
                        v-for="item in pickSyUserList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="温度最低警报值" prop="tempMin">
                    <el-input type="number" v-model="dataForm.tempMin">
                        <template slot="append">℃</template>
                    </el-input>
                  </el-form-item>
                  <el-form-item label="温度最高警报值" prop="tempMax">
                    <el-input type="number" v-model="dataForm.tempMax">
                        <template slot="append">℃</template>
                    </el-input>
                  </el-form-item>
                  <el-form-item label="蓝牙上报频率" prop="rfidMin">
                    <el-input type="number" v-model="dataForm.rfidMin">
                        <template slot="append">分钟</template>
                    </el-input>
                  </el-form-item>
                  <el-form-item label="心跳上报频率" prop="beat">
                    <el-input type="number" v-model="dataForm.beat">
                        <template slot="append">秒</template>
                    </el-input>
                  </el-form-item>
                  <!-- <el-form-item label="上传数据间隔-测试" prop="beat">
                    <el-time-select v-model="dataForm.beat" :picker-options="{ start: '00:00', step: '00:01', end: '01:00'}"
                        placeholder="选择时间" @change="aaa">
                    </el-time-select>
                  </el-form-item> -->
                  <el-form-item v-if="statusShow" label="报警状态" prop="warnStatus">
                    <el-select v-model="dataForm.warnStatus" clearable placeholder="请选择报警状态">
                        <el-option
                        v-for="item in warnStatusList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                        ></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item v-if="statusShow" label="制冷状态" prop="coldStatus">
                    <el-select v-model="dataForm.coldStatus" clearable placeholder="请选择制冷状态">
                        <el-option
                        v-for="item in coldStatusList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                        ></el-option>
                    </el-select>
                  </el-form-item>

                  <el-form-item label="备注" prop="remark" style="width:100%;">
                    <el-input type="textarea" v-model="dataForm.remark" style="width:100%;"></el-input>
                  </el-form-item>
              </el-row>
              <el-row>
                    <el-form-item>
                    <el-button plain type="primary" @click="sureClick">保 存</el-button>
                    <el-button plain @click="returnList">取 消</el-button>
                    </el-form-item>
              </el-row>
          </el-form>
      </div>
  </div>
</template>

<script>

import * as message from "@/constants/message";
import EquipApi from '@/api/equip/equip';
import EquipCardApi from '@/api/equip/equipCard';
import AuthApi from "@/api/system/auth";

export default {
    name:'BoxAdd',
    data(){
        return{
            dataForm:{
                boxId: null,
                boxName: null,
                cardId: null,
                syUserId: null,
                tempMax: null,
                tempMin: null,
                rfidMin: null,
                beat: null,
                warnStatus: null,
                coldStatus: null,
                remark: null
            },
            statusShow: false,
            roleRules:{
                boxName: [
                    { required: true, message: "请输入设备名称", trigger: "blur" }
                ],
                cardId: [
                    { required: true, message: "请选择物联网卡", trigger: "blur" }
                ],
                syUserId: [
                    { required: true, message: "请选择收样员", trigger: "blur" }
                ],
                tempMin: [
                    { required: true, message: "请输入温度最低警报值", trigger: "blur" }
                ],
                tempMax: [
                    { required: true, message: "请输入温度最高警报值", trigger: "blur" }
                ],
                rfidMin: [
                    { required: true, message: "请输入蓝牙上报频率", trigger: "blur" }
                ],
                beat: [
                    { required: true, message: "请输入心跳上报频率", trigger: "blur" }
                ],
            },
            pickSyUserList:[],
            pickIpCardList:[],
            coldStatusList:[
                { value: 0 ,label: '无'}
                /*{ value: 0 ,label: '未制冷'},
                { value: 1 ,label: '制冷中'}*/
            ],
            warnStatusList:[
                { value: 0 ,label: '正常'},
                { value: 1 ,label: '低温警告'},
                { value: 2 ,label: '高温警告'},
                { value: 3 ,label: '倾斜警告'},
                { value: 4 ,label: '锁未关警告'}

            ],
        }
    },
    mounted(){
        this.init()
    },
    methods:{
        init(){
            this.listSyUser();
            this.getIpCardList();
            if (this.$route.query.id) {
                this.dataForm.boxId = this.$route.query.id;
                this.getData();
                this.statusShow = true;
            }
        },
        keydown(e) {
            if (e.keyCode == 32) {
                e.returnValue = false;
            }
        },
        getData(){
            var cond = {
                id: this.dataForm.boxId
            }
            EquipApi.getEquipBoxInfo(cond)
                .then(data =>{
                    this.dataForm.boxName = data.data.boxName
                    this.dataForm.cardId = data.data.cardId
                    this.dataForm.syUserId = data.data.syUserId
                    this.dataForm.tempMin = data.data.tempMin
                    this.dataForm.tempMax = data.data.tempMax
                    this.dataForm.rfidMin = data.data.rfidMin
                    this.dataForm.beat = data.data.beat
                    this.dataForm.remark = data.data.remark
                    this.dataForm.warnStatus = data.data.warnStatus
                    this.dataForm.coldStatus = data.data.coldStatus
                })
        },
        listSyUser(){
            AuthApi.listAdminByRole({
                roleId: 4
            }).then(res => {
                setTimeout(() => {
                this.pickSyUserList = res.data.map(item => {
                    return {
                        value: item.userId,
                        label: item.userName
                    }
                })
                }, 200)
            })
        },
        // 获取ipCard列表
        getIpCardList(){
          EquipCardApi.listForSelect({isUsed:0}).then(res =>{
              setTimeout(() => {
                  this.pickIpCardList = res.data.map(item => {
                      return {
                          value: item.cardId,
                          label: item.iccid
                      }
                  })
              }, 200)
            })
        },
        sureClick(){
           this.$refs.dataForm.validate(valid =>{
                if(valid) {
                    this.$confirm(message.MSG_CONFIRM_SAVE_ALTER, message.TITLE_PROMPT, {})
                        .then(() => {
                            if(this.dataForm.boxId){
                                this.editData();
                            }else{
                                this.addData();
                            }
                    });
                }
            })
        },
        addData(){
            var cond ={
                boxName: this.dataForm.boxName,
                cardId: this.dataForm.cardId,
                syUserId: this.dataForm.syUserId,
                tempMin: this.dataForm.tempMin,
                tempMax: this.dataForm.tempMax,
                tempMax: this.dataForm.tempMax,
                rfidMin: this.dataForm.rfidMin,
                beat: this.dataForm.beat,
                remark: this.dataForm.remark
            }
            EquipApi.addEquipBox(cond)
                .then(data =>{
                    this.$Utils.notifySuccess();
                    this.returnList();
                })
        },
        editData(){
            var cond ={
                boxId: this.dataForm.boxId,
                boxName: this.dataForm.boxName,
                cardId: this.dataForm.cardId,
                syUserId: this.dataForm.syUserId,
                tempMin: this.dataForm.tempMin,
                tempMax: this.dataForm.tempMax,
                tempMax: this.dataForm.tempMax,
                rfidMin: this.dataForm.rfidMin,
                beat: this.dataForm.beat,
                remark: this.dataForm.remark,
            }
            EquipApi.editEquipBox(cond)
                .then(data =>{
                    this.$Utils.notifySuccess();
                    this.returnList();
                })
        },
        returnList(){
            this.dataForm = [];
            this.$store.dispatch('delView', this.$route);
            this.$router.push({path: '/equip/BoxManagement'});
        }
    }
}
</script>

<style lang="scss" src="@/assets/css/views/add.scss" scope>
</style>
